import React from 'react';
import { Typography } from 'antd';
import { CodepenSquareFilled } from '@ant-design/icons';
import Table from './Table';
import Map from './Map';
import FlowDiagram from './FlowDiagram';
import './index.scss';

const LoadBalancing = () => {
  return (
    <div className='LoadBalancing'>
      <div className='mapWarp'>
        <Map />
      </div>
      <div className='tableContainer'>
        <Table />
      </div>
      <div className='flowDiagramWarp'>
        <Typography.Title level={4}><CodepenSquareFilled spin style={{color: '#0079FF'}} />负载均衡</Typography.Title>
        <FlowDiagram />
      </div>
    </div>
  )
}

export default LoadBalancing;